<form nz-form [formGroup]="form" (submit)="submit()">
  <nz-mention
    [nzSuggestions]="teamMembers"
    [nzValueWith]="valueWith"
    [nzLoading]="loadingMembers"
    (nzOnSearchChange)="onSearchChange($event)"
    [nzNotFoundContent]="'No members found!'"
    (nzOnSelect)="onSelect($event)"
    (click)="setFocus(true, input)"
  >
    <nz-textarea-count [nzMaxCharacterCount]="2000">
      <textarea
        nz-input
        placeholder="Add a comment..."
        [rows]="rows"
        [nzAutosize]="{ minRows: rows, maxRows: rows }"
        [formControlName]="'content'"
        [maxlength]="2000"
        class="border-0"
        nzMentionTrigger
        #input
      ></textarea>
    </nz-textarea-count>
  </nz-mention>

  <div class="mt-3 justify-content-end d-flex" *ngIf="commentsInputFocused">
    <nz-space>
      <button *nzSpaceItem type="button" (click)="cancel()" nz-button nzType="default">Cancel</button>
      <button *nzSpaceItem [disabled]="!isValid()" type="submit" nz-button nzType="primary">Comment</button>
    </nz-space>
  </div>
</form>
